<template>
  <div class="info_chunk">
    <a-form-item :label="formData.hideTitle ? '':`${formData.name || ' '}`" :colon="formData.name ? true: false" :required="formData.required" :extra="formData.extra">
      <a-textarea
        :value="formData.defaultValue"
        :auto-size="{minRows: 3}"
        style="pointer-events: none;"/>
      <a-row style="pointer-events: none;">
        <a-col :span="1" class="below_name" v-for="v in specialList.filter(e => e.type === 'symbol')" :key="v.cid">
          {{ v.name }}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="12" v-for="v in specialList.filter(e => e.type !== 'symbol')" :key="v.cid" style="pointer-events: none;">
          <a-form-item
            :label="`${v.name}`"
          >
            <a-input
              style="width:160px"
              type="text"></a-input>
          </a-form-item>
        </a-col>
      </a-row>
    </a-form-item>
  </div>
</template>

<script>
export default {
  name: 'CountFormulaInfo',
  props: {
    formData: {
      type: Object,
      default: () => {}
    }
  },
  data () {
    return {
      specialList: [
        { cid: 1, type: 'symbol', name: '+', value: '+' },
        { cid: 2, type: 'symbol', name: '-', value: '-' },
        { cid: 3, type: 'symbol', name: '*', value: '*' },
        { cid: 4, type: 'symbol', name: '/', value: '/' },
        { cid: 5, type: 'symbol', name: '(', value: '(' },
        { cid: 6, type: 'symbol', name: ')', value: ')' },
        { cid: 9, type: 'symbol', name: '>', value: '>' },
        { cid: 10, type: 'symbol', name: '<', value: '<' },
        { cid: 11, type: 'symbol', name: '=', value: '=' },
        { cid: 12, type: 'symbol', name: '?', value: '?' },
        { cid: 13, type: 'symbol', name: ':', value: ':' },
        { cid: 7, type: 'customConstant', name: '自定义常数', value: '' },
        { cid: 8, type: 'staticConstant', name: '静态常数', value: '' }
      ]
    }
  }
}
</script>
<style scoped lang="less">
.base_chunk{
  box-sizing: border-box;
  font-size: 12px;
  display: block;
  // width: 5%;
  line-height: 26px;
  position: relative;
  float: left;
  left: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 1%;
  color: #333;
  padding: 2px;
  text-align: center;
}
.below_name{
  display: inline-flex;
  height: 40px;
  width: 40px;
  border: 1px solid rgb(217 217 217);
  align-items: center;
  justify-content: center;
  margin-right: 2%;
}
</style>
